<template>
  <div class="h-full flex flex-col">
    <div class="h-full flex flex-col">
      <a-card>
        <div slot="title">
          <a-space>
            <div class="ty"></div>
            {{ $t("app.setting.themecolor.daybreak") }}
          </a-space>
          <!-- 操作按钮 -->
          <a-dropdown style="right: 0; position: absolute; margin-right: 25px">
            <a-menu slot="overlay">
              <a-menu-item key="1" @click="showModal()">
                {{ $t("app.setting.themecolor.cc") }}
              </a-menu-item>
            </a-menu>
            <a-button type="primary" v-if="userroleid.indexOf('35') != -1">
              <a-icon type="bars" />
              {{ $t("di.menus") }}
              <a-icon type="down" />
            </a-button>
          </a-dropdown>
        </div>
        <!-- 主列表 -->
        <a-table
          ref="table"
          size="middle"
          class="h-full overflow-x-auto"
          :dataSource="listData"
          :pagination="false"
          @change="tableChange"
          :loading="listLoading"
          :rowKey="(record) => record.Id"
          :scroll="{ x: 2000, y: 2000 }"
        >
          <!-- DC 数据字段 -->
          <a-table-column
            key="Items"
            data-index="Items"
            width="60px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(1);
              }
            "
          >
            <span slot="title" class="min-w-90p">
              {{ $t("app.setting.themecolor.dust") }}
            </span>
            <!--  内容  -->
            <template slot-scope="text, record">
              <span v-if="$t('app.setting.themecolor.daybreak') === '数据分类分级详情'">
                {{record.Items}}
              </span>
              <span v-else>{{record.ItemsEn}}</span>
            </template>

            <!--  筛选+搜索功能  -->
            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect1"
                :filter-data="filterData"
                @searchCommit="searchQuery"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
          </a-table-column>

           <!-- 别名 -->
           <a-table-column
            key="SourceChildAliasName"
            data-index="SourceChildAliasName"
            width="60px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(8);
              }
            "
          >
            <span slot="title" class="min-w-90p">
              {{ $t("app.setting.themecolor.dust.alias") }}
            </span>
            <!--  内容  -->
            <template slot-scope="text, record">
              <span v-if="$t('app.setting.themecolor.daybreak') === '数据分类分级详情'">
                {{record.SourceChildAliasName}}
              </span>
              <span v-else>{{record.SourceChildAliasNameEn}}</span>
            </template>

            <!--  筛选+搜索功能  -->
            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect8"
                :filter-data="filterData"
                @searchCommit="searchQuery"
                @searchFilter="searchQueryFilter"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
          </a-table-column>

          <!-- DC 所属分类 -->
          <a-table-column
            key="Classification"
            :data-index="isLang ? 'Classification' : 'ClassificationEn'"
            width="30px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(2);
              }
            "
          >
            <span slot="title" class="min-w-90p">{{
              $t("app.setting.themecolor.dd")
            }}</span>

            <!--  内容  -->
            <template slot-scope="text, record">
              <span v-if="$t('app.setting.themecolor.daybreak') === '数据分类分级详情'">
                {{record.Classification}}
              </span>
              <span v-else>{{record.ClassificationEn}}</span>
            </template>

            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect2"
                :filter-data="filterData"
                :single-search="false"
                @searchFilter="searchQueryFilter"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
          </a-table-column>
          <!-- 所属子集 -->
          <a-table-column
            key="Subclass"
            data-index="Subclass"
            width="30px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(3);
              }
            "
          >
            <span slot="title" class="min-w-90p">{{
              $t("app.setting.themecolor.ee")
            }}</span>

            <!--  内容  -->
            <template slot-scope="text, record">
              <span v-if="$t('app.setting.themecolor.daybreak') === '数据分类分级详情'">
                {{record.Subclass}}
              </span>
              <span v-else>{{record.SubclassEn}}</span>
            </template>
            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect3"
                :filter-data="filterData"
                :single-search="false"
                @searchFilter="searchQueryFilter"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
          </a-table-column>
          <!-- 数据级别 -->
          <a-table-column
            key="Levels"
            data-index="Levels"
            width="30px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(4);
              }
            "
          >
            <span slot="title" class="min-w-90p">{{
              $t("app.setting.themecolor.sunset")
            }}</span>
            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect4"
                :filter-data="filterData"
                :single-search="false"
                @searchFilter="searchQueryFilter"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
            <template slot-scope="text, record">
              <span>{{ record.Levels }}</span>
            </template>
          </a-table-column>
          <!-- 数据敏感度 -->
          <a-table-column
            key="Sensitivy"
            data-index="Sensitivy"
            width="70px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(5);
              }
            "
          >
            <span slot="title" class="min-w-90p">{{
              $t("app.setting.themecolor.green")
            }}</span>
            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect5"
                :filter-data="filterData"
                :single-search="false"
                @searchFilter="searchQueryFilter"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
          </a-table-column>
          <!-- 涉及的APP ID -->
          <a-table-column
            key="AppId"
            data-index="AppId"
            width="50px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(6);
              }
            "
          >
            <span slot="title" class="min-w-90p">{{
              $t("app.setting.themecolor.purple")
            }}</span>
            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect6"
                :filter-data="filterData"
                @searchCommit="searchQuery"
                @searchFilter="searchQueryFilter"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
            <template slot-scope="text, record">
              <span>{{ record.AppId }}</span>
            </template>
          </a-table-column>
          <!-- 涉及的RPA -->
          <a-table-column
            key="RpaId"
            data-index="RpaId"
            width="40px"
            @filterDropdownVisibleChange="
              (e) => {
                if (e) this.setValus(7);
              }
            "
          >
            <span slot="title" class="min-w-90p">{{
              $t("app.setting.themecolor.aa")
            }}</span>
            <span
              slot="filterDropdown"
              slot-scope="{
                setSelectedKeys,
                selectedKeys,
                confirm,
                clearFilters,
                column,
              }"
            >
              <table-select
                ref="tableselect7"
                :filter-data="filterData"
                @searchCommit="searchQuery"
                @searchFilter="searchQueryFilter"
                @searchClose="confirm"
                @searchClean="tableCleanJobs"
              />
            </span>
            <template slot-scope="text, record">
              <a-row type="flex">
                <a-col>
                  <span
                    style="
                      display: block;
                      left: 1391px;
                      top: 360px;
                      width: 115px;
                      border-radius: 2px;
                      margin-right: 2px;
                      height: 34px;
                      opacity: 0.43;
                      border-radius: 2px;
                      background: rgba(213, 229, 255, 1);
                      font-size: 14px;
                      font-weight: 400;
                      letter-spacing: 0px;
                      line-height: 34px;
                      color: rgba(68, 78, 132, 1);
                      opacity: 1;
                      text-align: center;
                      vertical-align: center;
                    "
                    >{{ record.RpaId[0] ? record.RpaId[0] : "-" }}</span
                  >
                </a-col>
                <a-col v-show="record.RpaId.length - 1 != 0">
                  <span
                    style="
                      display: inline-block;
                      left: 1509px;
                      top: 360px;
                      width: 50px;
                      height: 34px;
                      margin: 0 2px;
                      opacity: 0.94;
                      border-radius: 2px;
                      background: rgba(213, 229, 255, 1);
                      line-height: 34px;
                      text-align: center;
                    "
                    >+{{ record.RpaId.length - 1 }}</span
                  >
                </a-col>
                <a-col v-show="record.RpaId.length - 1 != 0">
                  <a-button
                    type="primary"
                    icon="cloud"
                    @click="showAllRpa(record)"
                    style="
                      background: rgba(213, 229, 255, 1);
                      margin-left: 1px;
                      height: 34px;
                    "
                  />
                </a-col>
              </a-row>
            </template>
          </a-table-column>
          <!-- 操作 -->
          <a-table-column
            key="action"
            :title="$t('menu.exception.not-find')"
            width="100px"
            fixed="right"
            v-if="userroleid.indexOf('35') != -1"
          >
            <template slot-scope="text, record">
              <span>
                <a-dropdown>
                  <a-button type="link">
                    <a-icon type="more" />
                  </a-button>
                  <template #overlay>
                    <a-menu>
                      <a-menu-item @click="edit(record)">
                        <!-- 编辑 -->
                        <a-button type="link">{{
                          $t("user.verification-code.required111566147")
                        }}</a-button>
                      </a-menu-item>
                      <a-menu-item>
                        <a-popconfirm
                          :title="
                            $t('user.verification-code.required111566110577225')
                          "
                          :ok-text="$t('user.verification-code.required1166')"
                          :cancel-text="$t('user.email.required11')"
                          @confirm="() => del(record.Id)"
                        >
                          <a-button type="link" style="width: 100%; text-align: left">{{
                            $t("app.setting.copy")
                          }}</a-button>
                        </a-popconfirm>
                      </a-menu-item>
                    </a-menu>
                  </template>
                </a-dropdown>
              </span>
            </template>
          </a-table-column>
        </a-table>

        <!-- 分页 -->
        <a-pagination
          size="small"
          v-model="pagination.page"
          :total="pagination.total"
          hideOnSinglePage
          :pageSize.sync="pagination.pageSize"
          @change="getList"
        />
      </a-card>
      <!-- 抽屉组件  ref绑定save  succeed绑定初始化的 init事件  -->
      <createData ref="createData" @succeed="init" />
    </div>
    <a-modal
      :visible="showRpaList"
      @cancel="closeRpaList"
      :ok-text="$t('user.verification-code.required1166')"
      :cancel-text="$t('user.email.required11')"
    >
      <ul>
        <li v-for="(item, index) in rpaList" :key="index">
          {{ item }}
        </li>
      </ul>
    </a-modal>
  </div>
</template>

<script>
import { getUserInfo } from "@/api";

const rowSelection = {
  onChange: (selectedRowKeys, selectedRows) => {
    console.log(
      `selectedRowKeys: ${selectedRowKeys}`,
      "selectedRows: ",
      selectedRows
    );
  },
  onSelect: (record, selected, selectedRows) => {
    console.log(record, selected, selectedRows);
  },
  onSelectAll: (selected, selectedRows, changeRows) => {
    console.log(selected, selectedRows, changeRows);
  },
};
import { sourceLabelList } from "@/api/ytdg";
import { childataDelete, childataFilter, dropDownSelect } from "@/api/dcc";
import CreateData from "./components/createData.vue";
import tableSelect from "@/components/tableSelect/tableSelect.vue";

export default {
  name: "statistics",
  // 挂载 save组件
  components: { CreateData, tableSelect },
  data() {
    return {
      /**table数据 */
      listData: [],
      //点击搜索是否展开
      SearchFlag: false,
      // table的loading 状态
      listLoading: false,
      // 搜索from的对象 直接使用queryForm.AppId赋值
      queryForm: {
        AppId: undefined,
        AppName: undefined,
        AppOwner: undefined,
        AppDepartment: undefined,
      },
      rowSelection,
      //table中的Rpaid数据
      rpaId: [],
      searchText: "",
      searchInput: null,
      visible1: false,
      clicked1: false,
      clicked2: false,
      clicked3: false,
      inputValue2: "",
      inputValue1: "",
      inputValue3: "",
      // 分页参数
      pagination: {
        page: 1, //当前页
        pageSize: 10, //每页条数
        total: 0, //总条数
        showQuickJumper: true,
        hideOnSinglePage: true,
        showTotal: (total) =>
          this.$t(
            "user.verification-code.required111566110577216",
            total,
            "user.verification-code.required111566110577217"
          ),
      },
      dataLevel: [],
      dataSensitivity: [],
      //展示涉及rpa列表
      showRpaList: false,
      rpaList: [],
      setValusKey: "",
      filterData: [],
      userroleid: "",
      isLang: false,
      kvMap: [
        '', 'Items', 'Classification', 'Subclass',
        'Levels', 'Sensitivy', 'AppId', 'RpaId','aliasNames'
      ],
      okyMap: [
        '', 'ItemsStr', '', '', '',
        '', 'AppIdStr', 'RpaIdStr','aliasNameStr'
      ],
      isLang: localStorage.getItem("lang").includes("zh-CN")
    };
  },
  created() {
    this.init();
    this.initSelect();
  },
  mounted() {
    let that = this;
    this.$nextTick(() => {
      this.isLang = localStorage.getItem("lang").includes("zh-CN")
    })
    window.addEventListener("setItemEvent", function (e) {
      if (e.key === "lang") {
        let lang = JSON.parse(e.value);
        console.log(lang);
        if (lang === "zh-EN") {
          // that.translateLang(1);
          that.isLang = false;
        } else {
          // that.translateLang();
          that.isLang = true;
        }
      }
    });
  },
  methods: {
    // 查询Filter逻辑
    async setValus(typeId) {
      this.listLoading = true;
      try {
        // 调用查询列表
        let data = {}
        if(typeId !== 1) {
          let res = await childataFilter({ condition: typeId });
          data = res.data
        }
        // 赋值类型，用于筛选、搜索的直接调用
        this.setValusKey = typeId;
        // 赋值筛选的列表，直接赋值
        if (this.isLang){
          // 中文
          this.filterData = data;
        }else{
          // 英文
          var lists = []
          for (var i=0; i<data.length; i++){
            if(typeId===4||typeId===5||typeId===6||typeId===7){
              lists.push({text: data[i].text, value: data[i].value})
          
        }
        else{
          lists.push({text: data[i].textEn, value: data[i].value})

        }
          }
          
          
          this.filterData = lists
        }

      } catch (error) {
        // 报错信息
        this.$message.error(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
    },
    /**
     * 清空查询数据，并且执行查询
     * @returns {Promise<void>}
     */
    async tableCleanJobs(type) {
      this.pagination.page = 1;
      if(type === "part") {
        this.queryForm[this.kvMap[this.setValusKey]] = undefined
        this.queryForm[this.okyMap[this.setValusKey]] = undefined
      } else {
        this.queryForm = {}
        for(let i = 1; i <= 7; i++) {
          let dom = this.$refs[`tableselect${i}`]
          if(dom) {
            dom.inputValue = ""
            dom.inputCheckValue = []
          }
        }
      }
      this.inputValue = "";
      await this.getList();
    },
    /**
     * 列表搜索查询
     * @param e 搜索的值
     * @returns {Promise<void>}
     */
    async searchQuery(e) {
      this.queryForm[this.kvMap[this.setValusKey]] = undefined
      this.queryForm = {
        ...this.queryForm,
        [this.okyMap[this.setValusKey]]: e
      }
      await this.getList("filter");
    },

    /**
     * 列表筛选查询
     * @param e 筛选的值
     * @returns {Promise<void>}
     */
    async searchQueryFilter(e) {
      this.queryForm[this.okyMap[this.setValusKey]] = undefined
      this.queryForm = {
        ...this.queryForm,
        [this.kvMap[this.setValusKey]]: this.setValusKey === 4 || this.setValusKey === 5 
          ? e.replaceAll('/', '#@%$') : e
      }
      await this.getList("filter");
    },
    edit(record) {
      // console.log(record);
      this.$refs.createData.readInfo(record);
    },
    async del(id) {
      this.listLoading = true;
      try {
        await childataDelete({ Id: id });
        this.$message.success(
          this.$t("user.verification-code.required111566110577133")
        );
        this.getList();
      } catch (error) {
        // 报错信息
        this.$message.error(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
    },
    showModal() {
      this.$refs.createData.open();
    },
    async initSelect() {
      // 初始化下拉数据

      // 加载数据级别
      const { data: dataLevel } = await dropDownSelect({ Types: 1 });

      // 加载数据敏感度
      const { data: dataSensitivity } = await dropDownSelect({ Types: 2 });
      console.log("dataSensitivity", dataSensitivity);
      this.dataLevel = dataLevel;
      this.dataSensitivity = dataSensitivity;
    },
    handleChange() {},
    /**
     * 搜索事件 直接复制使用 通用的
     */
    search() {
      this.pagination.page = 1;
      this.getList();
    },
    // 分页事件 直接复制使用 通用的
    tableChange(e, searchInputs) {
      var parames = Object.keys(searchInputs);
      for (var i = 0; i < parames.length; i++) {
        searchInputs[parames[i]] = searchInputs[parames[i]].join();
      }
      console.log("searchInputs", searchInputs);
      this.queryForm = { ...searchInputs };
      this.getList("filter");
    },
    // 创建成功刷新列表 or 初始化事件 通用的 如果搜索条件有下拉列表 就需要放这里面
    async init() {
      this.pagination.page = 1;
      await this.getList();

      //获取用户信息
      const { data } = await getUserInfo();
      this.userroleid = data.role;
    },
    filterOption(input, option) {
      return (
        option.componentOptions.children[0].text
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
      );
    },
    async getList(state) {
      this.listLoading = true;
      const { page, pageSize } = this.pagination;
      try {
        if (state == "filter") {
          // 调用查询列表
          const { data } = await sourceLabelList({
            ...{ page: 1, pageSize: 10 },
            ...this.queryForm,
          });
          // 解构赋值
          const { Page, PageSize, Total, Lists } = data;
          console.log("Lists-----------", Lists);
          const defaultzhi = "-"; // 设置默认值
          const List2 = Lists.map((item) => {
            const rpaId = item.RpaId.split(",");
            console.log(rpaId);
            return {
              ...item,
              Items: item.Items || defaultzhi,
              Classification: item.Classification || defaultzhi,
              Subclass: item.Subclass || defaultzhi,
              Levels: item.Levels || defaultzhi,
              Sensitivy: item.Sensitivy || defaultzhi,
              AppId: item.AppId || defaultzhi,
              RpaId: rpaId || defaultzhi,
            };
          });

          // 给table赋值
          this.listData = List2 || [];
          console.log("listData", this.listData);
          // 给分页数据赋值
          this.pagination = {
            page: Page,
            pageSize: PageSize,
            total: Total,
          };
        } else {
          // 调用查询列表
          const { data } = await sourceLabelList({
            ...{ page, pageSize },
            ...this.queryForm,
          });
          // 解构赋值
          const { Page, PageSize, Total, Lists } = data;
          console.log("Lists-----------", Lists);
          const defaultzhi = "-"; // 设置默认值
          const List2 = Lists.map((item) => {
            const rpaId = item.RpaId.split(",");
            console.log(rpaId);
            return {
              ...item,
              Items: item.Items || defaultzhi,
              Classification: item.Classification || defaultzhi,
              Subclass: item.Subclass || defaultzhi,
              Levels: item.Levels || defaultzhi,
              Sensitivy: item.Sensitivy || defaultzhi,
              AppId: item.AppId || defaultzhi,
              RpaId: rpaId || defaultzhi,
            };
          });

          // 给table赋值
          this.listData = List2 || [];
          console.log("listData", this.listData);
          // 给分页数据赋值
          this.pagination = {
            page: Page,
            pageSize: PageSize,
            total: Total,
          };
        }
      } catch (error) {
        // 报错信息
        this.$message.error(error);
        console.log(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
    },
    //table搜索input
    onChange(e) {
      this.inputData = e.data;
      console.log("inputValue", this.inputValue1);
      console.log("inp", this.inputValue2);
      console.log("3", this.inputValue3);
    },
    //搜索1
    async tableSearch1() {
      this.listLoading = true;
      const { page, pageSize } = this.pagination;
      try {
        // 调用查询列表
        const { data } = await sourceLabelList({
          ...{ page: 1, pageSize: 10 },
          ...(this.queryForm = {
            ItemsStr: this.inputValue1,
          }),
        });
        // 解构赋值
        const { Page, PageSize, Total, Lists } = data;
        console.log("Lists-----------", Lists);
        const defaultzhi = "-"; // 设置默认值
        const List2 = Lists.map((item) => {
          const rpaId = item.RpaId.split(",");
          console.log(rpaId);
          return {
            ...item,
            Items: item.Items || defaultzhi,
            Classification: item.Classification || defaultzhi,
            Subclass: item.Subclass || defaultzhi,
            Levels: item.Levels || defaultzhi,
            Sensitivy: item.Sensitivy || defaultzhi,
            AppId: item.AppId || defaultzhi,
            RpaId: rpaId || defaultzhi,
          };
        });

        // 给table赋值
        this.listData = List2 || [];
        console.log("listData", this.listData);
        // 给分页数据赋值
        this.pagination = {
          page: Page,
          pageSize: PageSize,
          total: Total,
        };
      } catch (error) {
        // 报错信息
        this.$message.error(error);
        console.log(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
      this.clicked1 = false;
      this.inputValue1 = "";
    },
    //table1搜索重置1
    async ReaTable1() {
      this.pagination.page = 1;
      this.queryForm = {};
      this.getList();
      this.inputValue1 = "";
      this.clicked1 = false;
    },
    //搜索2
    async tableSearch2() {
      this.listLoading = true;
      const { page, pageSize } = this.pagination;
      try {
        // 调用查询列表
        const { data } = await sourceLabelList({
          ...{ page: 1, pageSize: 10 },
          ...(this.queryForm = {
            AppIdStr: this.inputValue2,
          }),
        });
        // 解构赋值
        const { Page, PageSize, Total, Lists } = data;
        console.log("Lists-----------", Lists);
        const defaultzhi = "-"; // 设置默认值
        let List2 = [];
        if (Array.isArray(Lists)) {
          List2 = Lists.map((item) => {
            const rpaId = item.RpaId.split(",");
            console.log(rpaId);
            return {
              ...item,
              Items: item.Items || defaultzhi,
              Classification: item.Classification || defaultzhi,
              Subclass: item.Subclass || defaultzhi,
              Levels: item.Levels || defaultzhi,
              Sensitivy: item.Sensitivy || defaultzhi,
              AppId: item.AppId || defaultzhi,
              RpaId: rpaId || defaultzhi,
            };
          });
        }

        // 给table赋值
        this.listData = List2 || [];
        console.log("listData", this.listData);
        // 给分页数据赋值
        this.pagination = {
          page: Page,
          pageSize: PageSize,
          total: Total,
        };
      } catch (error) {
        // 报错信息
        this.$message.error(error);
        console.log(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
      this.clicked2 = false;
      this.inputValue2 = "";
    },
    //table1搜索重置2
    async ReaTable2() {
      this.pagination.page = 1;
      this.queryForm = {};
      this.getList();
      this.inputValue2 = "";
      this.clicked2 = false;
    },
    //搜索3
    async tableSearch3() {
      this.listLoading = true;
      const { page, pageSize } = this.pagination;
      try {
        // 调用查询列表
        const { data } = await sourceLabelList({
          ...{ page: 1, pageSize: 10 },
          ...(this.queryForm = {
            RpaIdStr: this.inputValue3,
          }),
        });
        // 解构赋值
        const { Page, PageSize, Total, Lists } = data;
        console.log("Lists-----------", Lists);
        const defaultzhi = "-"; // 设置默认值
        const List2 = Lists.map((item) => {
          const rpaId = item.RpaId.split(",");
          console.log(rpaId);
          return {
            ...item,
            Items: item.Items || defaultzhi,
            Classification: item.Classification || defaultzhi,
            Subclass: item.Subclass || defaultzhi,
            Levels: item.Levels || defaultzhi,
            Sensitivy: item.Sensitivy || defaultzhi,
            AppId: item.AppId || defaultzhi,
            RpaId: rpaId || defaultzhi,
          };
        });

        // 给table赋值
        this.listData = List2 || [];
        console.log("listData", this.listData);
        // 给分页数据赋值
        this.pagination = {
          page: Page,
          pageSize: PageSize,
          total: Total,
        };
      } catch (error) {
        // 报错信息
        this.$message.error(error);
        console.log(error);
      } finally {
        // 不管成功失败都会执行
        this.listLoading = false;
      }
      this.clicked3 = false;
      this.inputValue3 = "";
    },
    //table1搜索重置3
    async ReaTable3() {
      this.pagination.page = 1;
      this.queryForm = {};
      this.getList();
      this.inputValue3 = "";
      this.clicked3 = false;
    },
    handleClickChange1(visible) {
      console.log("visible", visible);
      this.clicked1 = visible;
    },
    handleClickChange2(visible) {
      console.log("visible", visible);
      this.clicked2 = visible;
    },
    handleClickChange3(visible) {
      console.log("visible", visible);
      this.clicked3 = visible;
    },
    showAllRpa(record) {
      // console.log(record.RpaId);
      this.rpaList = record.RpaId;
      this.showRpaList = true;
    },
    closeRpaList() {
      this.showRpaList = false;
    },
  },
};
</script>

<style>
.ant-pagination {
  float: right;
}
</style>
